<template>
	<view class="fault-index-pages">
		<view class="new-block" v-for="item in list" :key="item.id">
			<view class="new-title">{{item.subject}}</view>
			<view class="time-item">
				<view class="new-text">{{item.noticeTime}}</view>
				<view class="new-text" style="color: #ea0000;" v-if="item.status==4">驳回</view>
				<view class="new-text" style="color: #18aa00;" v-if="item.status==2">已维修</view>
				<view class="new-text" style="color: #ffa100;" v-if="item.status==1">待核实</view>
				<view class="new-text" style="color: #ffa100;" v-if="item.status==3">派单中</view>
				<view class="new-text" style="color: #ffa100;" v-if="item.status==5">待维修</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						id: 1,
						subject: '世博花园12号楼4单元⻔⼝路⾯塌⽅',
						noticeTime: '2025-03-11 15:35',
						status: 1
					},
					{
						id: 2,
						subject: '世博花园12号楼4单元⻔⼝路⾯塌⽅',
						noticeTime: '2025-03-11 15:35',
						status: 2
					},
					{
						id: 3,
						subject: '世博花园12号楼4单元⻔⼝路⾯塌⽅',
						noticeTime: '2025-03-11 15:35',
						status: 4
					},
					{
						id: 4,
						subject: '世博花园12号楼4单元⻔⼝路⾯塌⽅                         ',
						noticeTime: '2025-03-11 15:35',
						status: 3
					},
					{
						id: 5,
						subject: '世博花园12号楼4单元⻔⼝路⾯塌⽅                         ',
						noticeTime: '2025-03-11 15:35',
						status: 5
					}
				],
			}
		}
	}
</script>

<style lang="scss" scoped>
	.fault-index-pages {
		padding: 30rpx;

		.new-block {
			background-color: #fff;
			margin-bottom: 30rpx;
			border-radius: 20rpx;
			padding: 30rpx;

			.new-title {
				font-size: 32rpx;
				margin-bottom: 20rpx;
			}

			.time-item {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.new-text {
					font-size: 28rpx;
					color: #767676;
				}
			}

		}
	}
</style>